<template>
	<view class="content">
		<scroll-view class="scroll-box" scroll-y="">
			<view v-if="dataPool.length == 0" class="noClass">
				<text>您还没有绑定孩子</text>
			</view>
			<view class="box" v-for="(item, index) in dataPool" :key="index" @tap="activeCurrent(index,item)">
				<view class="box-cont">
					<view class="class_item_left">
						<headimg :realSrc="item.avatar"></headimg>
					</view>
					<view class="center-cont">
						<view class="center-cont-item1">{{item.nicheng}}</view>
						<view class="center-cont-item2">
							<text>{{item.school_name}}-{{item.gradeName}}</text>
						</view>
					</view>
					<i class="iconfont iconjiantou font-styll"></i>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import headimg from '@/components/head_img.vue'
	import util from '@/common/util.js';
	export default {
		data() {
			return {
				dataList: [1, 2, 3, 4, 5],
				currentList: 0,
				dataPool: [],
				type: 0
			};
		},
		components: {
			headimg
		},
		onLoad(e) {
			if (e.type) {
				this.type = e.type
			}
			this.getChildren()
		},
		methods: {
			activeCurrent(index, item) {
				this.currentList = index;
				uni.setStorageSync('index', index);
				uni.setStorageSync('currentChild', item);
				if (this.type == 2) {
					uni.navigateTo({
						url: 'child-detail'
					})
				} else {
					setTimeout(function() {
						uni.navigateBack({
							delta: 1
						});
					}, 200);
				}
			},
			getChildren() {
				this.$zapi.apiPost('user/currency.Parents/childlist').then((res) => {
					if (res.data.code !== 200) {
						return
					}
					this.dataPool = res.data.data;
					this.dataPool.forEach((item, key) => {
						item.nicheng = item.nicheng ? item.nicheng : '未设置昵称';
						item.gradeName = item.grade ? util.getgradeName(item.grade) : '未知年级';
						if (item.school_info && item.school_info.length > 0 && item.school_info[0].schoolid > 0) {
							let school = item.school_info[0]
							item.school_name = school.school_name ? school.school_name : '未知学校';
						} else {
							item.school_name = '未绑定学校';
						}
					})
				})
			}
		}
	};
</script>

<style scoped>
	.content {
		position: absolute;
		width: 100%;
		height: 100%;
		background-color: #F3F3F3;
	}

	.scroll-box {
		height: 100%;
	}

	.noClass {
		width: 750upx;
		text-align: center;
		font-size: 36upx;
		margin-top: 400upx;
		color: #999999;
	}

	.content_list {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 20upx;
		height: 120upx;
		background-color: #FFFFFF;
		border: 1px solid #f3f3f3;
	}

	.con_list_content {
		display: flex;
		align-items: center;
		margin-left: 30upx;
	}

	.con_list_avar {
		width: 75upx;
		height: 75upx;
		border-radius: 75upx;
	}

	.avar_img {
		width: 75upx;
	}

	.con_list_name {
		margin-left: 29upx;
	}

	.con_list_sing {
		width: 26upx;
		height: 26upx;
		border-radius: 35upx;
		margin-right: 80upx;
	}

	.checkLi {
		background-color: #fe9900;
	}


	.box {
		display: flex;
		align-items: center;
		margin-left: auto;
		margin-right: auto;
		width: 690upx;
		height: 160upx;
		margin-top: 20upx;
		background-color: #ffffff;
		border-radius: 30upx;
	}

	/* 	.box:nth-child(1) {
		margin-top: 0;
	} */
	.box-cont {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-left: auto;
		margin-right: auto;
		width: 606upx;
	}

	.class_item_left {
		width: 100upx;
		height: 100upx;
		border-radius: 50%;
		line-height: 1;
	}

	.center-cont {
		display: flex;
		flex-direction: column;
		justify-content: center;
		position: relative;
		width: 418upx;
		left: 1upx;
		height: 80upx;
	}

	.center-cont-item1 {
		color: #333333;
		font-size: 36upx;
	}

	.center-cont-item2 {
		color: #666666;
		font-size: 32upx;
	}

	.font-styll {
		font-size: 48upx;
		color: #999999;
	}
</style>
